<template>
	<view class="h-full bg-stone-100 flex flex-col">
		<u-status-bar bgColor="#fff"></u-status-bar>
		<view class="bg-white p-2">
			<view class="flex items-center">
				<u-search placeholder="请输入剧名" v-model="search.keyword" focus shape="square" @search="seachFn()" @clear="seachFn()" @custom="seachFn()"></u-search>
			</view>
		</view>
		<view class="h-full" id="lzmescroll">
			<mescroll-item ref="mescrollItem" :height="height" :search="search"></mescroll-item>
		</view>
		<u-no-network></u-no-network>
	</view>
</template>

<script>
	let that
	import MescrollItem from "./mescroll-swiper-item.vue";
	import {
		mapGetters,
		mapMutations
	} from 'vuex'
	export default {
		computed: {
			...mapGetters(['userInfo', 'api']),
		},
		components: {
			MescrollItem
		},
		data() {
			return {
				height:'80%',
				search: {
					keyword: '',
				},
			}
		},
		onLoad() {
			that = this
			setTimeout(() => {
				const query = uni.createSelectorQuery().in(this);
				query.select("#lzmescroll").boundingClientRect((data) => {
					if (data) {
						this.height = data.height + 'px'
					}
				}).exec();
			},500)
		},
		methods: {
			// 筛选类型
			seachFn(){
				this.$refs.mescrollItem.downCallback()
			}
		}
	}
</script>

<style lang="scss">
</style>